<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>数组解构</title>
</head>

<body>
    <script>
        // 数组解构 快速将数组里面的值赋值给变量 使用时可直接使用变量
        const [max, min, avg] = [100, 60, 80]
        console.log(max, min, avg) // 100 60 80

        // 数组解构 快速交换变量的值
        let a = 1, b = 2;
        [b, a] = [a, b]
        console.log(a, b) // 2, 1

        // 变量少，单元值多
        const [m, n, ...o] = [1, 2, 3, 4]
        console.log(m, n, o); // 1 2 [3, 4] 没有剩余参数接收则丢单元值失

        // 变量多，单元值少
        const [x, y, z] = [1, 2]
        console.log(x, y, z); // 1 2 undefined

        // 按需导入赋值
        const [e, , f, g] = [1, 2, 3, 4]
        console.log(e, f, g); // 1 2 4

        // 防止undefined
        const [h = 0, i = 0] = [1]
        console.log(h, i); // 1 0

        // 多维数组解构
        const [k, l, [p, q]] = [1, 2, [3, 4]]
        console.log(k, l, p, q); // 1 2 3 4
    </script>
</body>

</html>